<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/page/include/taglib.jsp"%>
<%@ page import="java.sql.*"%>
<%//连接数据库
String driverName = "com.mysql.jdbc.Driver"; //Mysql数据库连接
String userName = "root";
String psw = "123456"; //本行和上一行是数据库的登录名和密码
String dbName = "test1"; //数据库名字
String url = "jdbc:mysql://localhost:3306/test1?serverTimezone=UTC";
Class.forName("com.mysql.jdbc.Driver");
Connection conn = DriverManager.getConnection(url, userName, psw);					
Statement stmt = conn.createStatement(); %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="${ctx}/layui/css/layui.css">
<script>
	var ctx = "${ctx}";
</script>
<style type="text/css">
      .layui-input,.layui-select { width: 250px ; }
</style>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").fadeIn();
    $("#div2").fadeIn("slow");
    $("#div3").fadeIn(3000);
  });
});
</script>

</head>
<body>
	<form class="layui-form" style="width: 80%;" id="auf">
		<div class="layui-form-item">
			<label class="layui-form-label">收货人</label>
			<div class="layui-input-inline">
				 	<input type="text" name="name" id="name" class="layui-input"
					lay-verify="required" placeholder="请填写真实姓名" value=""> 
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">手机号码</label>
			<div class="layui-input-inline">
				<input type="text" name="phone" id="phone"
					class="layui-input" lay-verify="required" placeholder="请填写真是手机号"
					value="">
			</div>
		</div>
<div class="layui-form-item" id="area-picker">
            <label class="layui-form-label">地址</label>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="province" class="province-selector layui-input search_input" id="province" lay-filter="province-1">
                    <option value="">请选择省</option>
                </select>
            </div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="city" class="city-selector layui-input search_input" id="city" lay-filter="city-1">
                    <option value="">请选择市</option>
                </select>
            </div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="county" class="county-selector layui-input search_input" id="county" lay-filter="county-1">
                    <option value="">请选择区</option>
                </select>
            </div>
        </div>
	<div class="layui-form-item">
	<label class="layui-form-label">      </label>
			<div class="layui-input-inline">
				<input type="text" name="address_detailed" id="address_detailed"
					class="layui-input" lay-verify="required" placeholder="请填写详细地址"
					value="">
			</div>
		</div>
				<div class="layui-form-item">
			<label class="layui-form-label">邮政编码</label>
			<div class="layui-input-inline">
				<input type="text" name="zipcode" id="zipcode"
					class="layui-input" lay-verify="required" placeholder="请填写邮政编码"
					value="">
			</div>
		</div>


		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn" lay-submit="" lay-filter="addAddress">立即提交</button>
			</div>
		</div>
	</form>
	<script type="text/javascript" src="${ctx }/layui/layui.js"></script>
	<script type="text/javascript" src="${ctx }/js/address/addAddress.js"></script>
	<script>
      // 组件路径
        layui.config({
            base: '${ctx}/js/'
            	 , version: '1.0'
        });
      //一般直接写在一个js文件中
        layui.use(['layer', 'form', 'layarea'], function () {
            var layer = layui.layer
                , form = layui.form
                , layarea = layui.layarea;

            layarea.render({
                elem: '#area-picker',
                change: function (res) {
                    //选择结果
                    console.log(res);
                }
            });
        });
    </script>
</body>
</html>